<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .main{
        width: 1200px;
        height: 800px;
        margin: 100px auto; 
        border: 1px solid #000;
    }
    .title{
        text-align: center;
        color: red;
        border: 1px solid #000;

    }
    .content{
        width: 1200px;
        text-align: center;

    }
    .content div{
        margin-top: 20px;
    }
</style>
<script src="https://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script>
    $(function(){
        var bid=document.location.href
        var index=bid.lastIndexOf("/")+1
        bid=bid.substring(index )
        //设置form表单地址
        $("form").prop({action:"/change/"+bid})
        //请求会显数据
        $.get("/changedata/"+bid,function(data){
             $("[name='name']").val(data.name)
             $("[name='price']").val(data.price)
             $("[name='summary']").val(data.summary)
             $("[name='quantity']").val(data.quantity)
        })
    })
</script>
<body>
    <div class="main">
    <div class="title"><h1>修改书本</h1></div>
    <div class="content">
        <form action="/change" method="post">
            <div>书名：<input type="text" name="name" id=""></div>
            <div>价格：<input type="text" name="price" id=""></div>
            <div>描述：<input type="text" name="summary" id=""></div>
            <div>库存：<input type="text" name="quantity" id=""></div>
                 <div></div> <input type="reset" value="重置">              <input type="submit" value="修改"></div>
        </form>

    </div>
    </div>
</body>
</html>